<template>
  <div>
    <selectItem @changeSelect="changeSelect" :formItem="compConfig" :formNamePath="props.formNamePath"></selectItem>
  </div>
</template>

<script lang="ts" setup>
import { ref, computed, nextTick, onMounted } from "vue"
import selectItem from "../../formitem/select/index.vue"
import formItemForm from './config';
import { useColumnModel } from '@/components/draggable/hooks/useColumnModel';
import { useModelStore } from '@/store/modules/model/column';
import request from "@/api/index";
const useModel = useModelStore()
const props = defineProps({
  element: [],
  formNamePath: []
})
const compConfig = ref(JSON.parse(JSON.stringify(formItemForm.component.settings)));
useColumnModel(compConfig, computed(() => props.element))
const changeSelect = (value: string) => {
  useModel.setData({ param: formItemForm.component.settings.param, value })
}
const fetchcontentList = async () => {
  let data = await request.getSelectList({ secretType: 1 });
  data.forEach((item: any) => {
    item.label = item.name;
    item.value = item.id;
  });
  nextTick(() => {
    compConfig.value.options = data;
  });

  // modelData.value.options = data;
};
onMounted(() => {
  fetchcontentList();
});

</script>

<style lang="less" scoped></style>